import React from 'react';
import useFetch from 'use-http';
import { useParams } from 'react-router';
import { useReplay } from '../../service';

const SessionVideo = () => {
  const { id } = useParams();
  const { loading, data = {} } = useReplay(id);

  if (loading) {
    return null;
  }

  return (
    <video controls autoPlay style={{width: '800px'}}>
      <source src={`http://${window.location.host}/videos/${id}.webm`} type="video/webm" />
    </video>
  );
};

export default SessionVideo;
